import { CheckboxGroupField, CommonForm } from '@/pages/OrderModule/common/components/CommonForm';
import Typography from '@/pages/OrderModule/common/components/Typography';
import { Radio, Switch } from 'antd';

export const GoodHead = (props) => {
  const { initValues, onChange } = props;

  return (
    <CommonForm
      formProps={{
        initialValues: initValues,
        onValuesChange(changedValues, values) {
          onChange?.(values);
        },
      }}
      columns={[
        {
          Component: Radio.Group,
          name: 'image',
          label: (
            <Typography as="s2" useBold>
              图片展示
            </Typography>
          ),
          labelCol: {
            span: 24,
          },
          props: {
            numCol: 2,
            options: [
              { label: '小图', value: 'small' },
              { label: '大图', value: 'large' },
              { label: '不显示', value: 'none' },
            ],
          },
        },
        {
          Component: CheckboxGroupField,
          name: 'info',
          label: (
            <Typography as="s2" useBold>
              商品信息
            </Typography>
          ),
          labelCol: {
            span: 24,
          },
          props: {
            numCol: 2,
            options: [
              { label: '商品名称', value: 'name' },
              { label: '颜色规格', value: 'color' },
              { label: '商品编码', value: 'goods' },
              { label: '款式编码', value: 'style' },
            ],
          },
        },
        {
          Component: Switch,
          name: 'all',
          label: '显示所有商品',
          props:{
            checked: initValues.all
          }
        },
      ]}
    />
  );
};
export default GoodHead;
